<template>
  <div class="login">
    <div class="login-container">   
      <h1>修改密码</h1> 
      <div class="int-box">
        <el-input v-model="oldPassword" type="password"
                  placeholder="输入旧密码"></el-input>
      </div> 
      <div class="int-box">
        <el-input v-model="newPassword" type="password"
                  placeholder="输入新密码"></el-input>
      </div> 
      <div class="int-box">
        <el-input v-model="password" type="password"
                  placeholder="再次输入新密码"></el-input>
      </div> 
    </div>
    <div class="submit-box">
        <el-button @click="sure"
                width="100%"
                type="primary">确认修改</el-button> 
    </div>
    
  </div> 
</template>

<script>
import { Message } from 'element-ui'
import api from '@/api/api.js'
import { JSEncrypt } from 'jsencrypt'
export default {
  name: 'login',
  data () {
    return { 
      passwordKey: 'MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDYqxNMjTRQIvf9JylgBaCOwdAvE3XwWJownq8K8iy5FDMaC7wYHmbw6s+B66TcOYLZFy10mUYxkV+J+epmpnIxMSdXYZ7sU2pqbB9tZmtdkiy4YLoXQUirwaZsEJSApQF/P9StfqAralyG2wguBYyujF8EdV4Kbrb5vD+QTxcwxQIDAQAB',
      password:'',
      oldPassword:'',
      newPassword:'',
    }
  },
  mounted () {  
  },
  methods: {
    sure(){
      if(!this.oldPassword){
        return this.$vux.toast.show({
          text: '请输入旧密码',
          type:'text'
        })
      }
      if(!this.newPassword){
        return this.$vux.toast.show({
          text: '请输入新密码',
          type:'text'
        })
      }
      if(!this.password){
        return this.$vux.toast.show({
          text: '请输入确认新密码',
          type:'text'
        })
      }
      if(this.newPassword !==  this.password){
        return this.$vux.toast.show({
          text: '两次密码不一致喔~',
          type:'text'
        })
      }
       this.$vux.confirm.show({
        title: '修改密码',
        content: '确认修改？', 
        onCancel () { 
        },
        onConfirm: ()=> {
          this.submit()
        }
       })
    },
    submit(){
      let params ={ } 
      let encrypt = new JSEncrypt(); 
      encrypt.setPublicKey(this.passwordKey);
      const newPass = encrypt.encrypt(this.password);
      const oldPass = encrypt.encrypt(this.oldPassword);
      params.newPass = newPass; 
      params.oldPass = oldPass;  
      api.user.updatePass(params,()=>{
        localStorage.cp_userInfo="";
        return this.$vux.toast.show({
          text: '修改密码成功,请您重新登录',
          type:'text',
          onShow: ()=> {
            this.$router.push({path:'/login'})
          },
        })
      })
    }
  }
}
</script>
 
<style lang="less" scoped> 
.login{
    padding: 80px 20px 0;
    text-align: center;
}
.submit-box{
    margin-top: 40px; 
    /deep/button{
        width: 100%;
    }
} 
.int-box{
    margin-top: 20px;
}
</style>
